import React, { useState } from "react";
import { Button, Modal, Radio, Form, Input, Upload, message, Select } from "antd";
import { PlusOutlined, LoadingOutlined } from '@ant-design/icons';
import { add, exist } from "../../services/classify";



export default function Add({ show }) {
    const [isModalVisible, setIsModalVisible] = useState(false);
    const [loading, setLoading] = useState(false);

    const [form] = Form.useForm();
    const showModal = () => {
        setIsModalVisible(true);
    };

    const handleOk = async () => {
        let values = form.getFieldsValue();
        let data = await exist(values)
        console.log("data:", data);
        if(data.status==0){
// console.log("该类型已存在");
alert("该类型已存在，请用其他类型名")
        }else{
            await add({ ...values, state: 1 });
            show();
            setIsModalVisible(false);
        }
       
    };

    const handleCancel = () => {
        setIsModalVisible(false);
    };


    return (
        <div>
            <Button type="primary" onClick={showModal}>
                增加
            </Button>
            <Modal
                title="增加类型"
                visible={isModalVisible}
                onOk={handleOk}
                onCancel={handleCancel}
            >
                <Form
                    name="addForm"
                    form={form}
                    labelCol={{
                        span: 4,
                    }}
                    wrapperCol={{
                        span: 20,
                    }}
                    autoComplete="off"
                >

                    <Form.Item
                        label="类型"
                        name="sort"
                        hasFeedback
                        rules={[
                            {
                                required: true,
                                message: "类型不能为空",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    {/* <Form.Item
                        label="状态"
                        name="state"
                        hasFeedback
                        rules={[
                            {
                                required: true,
                                message: "状态不能为空",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item> */}

                    {/* <Form.Item
                        label="状态"
                        name="state"
                        rules={[{ required: true, message: '不能为空!' }]}
                    >

                        <Select>
                            <Select.Option value="1">1</Select.Option>
                        </Select>
                    </Form.Item> */}
                </Form>
            </Modal>
        </div>
    );
}
